{% extends '::base.html.twig' %}

{% block resources_attributes %} class="active"{% endblock %}

{% block title %}{{ post.getTitle(locale) }}{% endblock %}

{% block body %}


<div class="row-fluid whiteWrapper blogPage">


    <fieldset>
        <legend>{% trans %}Blog{% endtrans %}</legend>
        <hr class="smallHr">
    </fieldset>


    <div class="postBlock">
        <a href="javascript:void(0)"><h5>&raquo; {{ post.getTitle(locale) }}</h5></a>
        <p>
            {% if post.image %}
                <img src="{{ post.getSmallImageUrl(600,400)}}" class="img-polaroid postImage"/>
            {% endif %}
            <!--
        <blockquote>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
            <small >Name Gose Here </small>
        </blockquote>
        <br/>
            -->

        {{ post.getContent(locale) | raw}}
        </p>

    </div>
    <div class="{% if comments | length > 0 %}answersAndCommentsCaontainer{% endif %}">
        {% if commentsCount > post_page_comments_number %}
        <div class="comment">
            <span class="author">
                <a href="javascript:void(0)" id="seeAllComments">
                {% trans %}see all{% endtrans %} {{ commentsCount }} {% trans %}comments{% endtrans %}
                </a>
                <img src="{{ asset('img/ajax-loader.gif') }}" id="shwoAllCommentsLoader" style="display: none;"/>
            </span>
        </div>
        {% endif %}

        {% for comment in comments %}
            <div class="comment">
                <span class="author">{{ comment.user }}</span>
                {{ comment }}
            </div>
        {% endfor %}
    </div>

    <div class="sendMessageBlock">

        <form class="form-horizontal">
            <fieldset>
                <legend>{% trans %}Comment{% endtrans %}</legend>
                <hr class="smallHr">
                <div class="control-group">
                    <label class="control-label">{% trans %}Write your comment here{% endtrans %}</label>
                    <div class="controls">
                        <textarea cols="3" class="input-xxlarge" id="postCommentText"></textarea>
                        <span class=" help-block">{% trans %}Please make sure all comments follow our{% endtrans %} <a href="#Guidelines" role="button" data-toggle="modal" >{% trans %}Community Guidelines{% endtrans %}</a></span>
                    </div>
                </div>

                <div class="control-group">
                    <div class="controls">
                        {% if not is_granted('ROLE_USER') %}
                        <a class="btn blue submit" id="postCommentButton" href="#signUpAndLogin" role="button" data-toggle="modal">{% trans %}Comment{% endtrans %}</a>
                        {% else %}
                        <button class="btn blue submit" type="button" id="postCommentButton">{% trans %}Comment{% endtrans %}</button>
                        <img src="{{ asset('img/ajax-loader.gif') }}" id="commentLoader" style="float: right;margin-right: 175px;display: none;"/>
                        {% endif %}
                    </div>
                </div>

            </fieldset>
        </form>
    </div>

</div>

<div class="modalContainer">
    <div id="Guidelines" class="modal hide fade wetAsphalt" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

        <div class="modal-header">
            <h3 id="myModalLabel">{% trans %}Community Guidelines{% endtrans %}</h3>
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        </div>

        <div class="modal-body">
            <div class="guidelines">
                <p>
                    {% trans %}Hi! Welcome to the Educino community! In order to post on this site, please follow the guidelines below. We appreciate your contribution to making this resource useful and informative{% endtrans %}
                </p>

                <ul>
                    <li>{% trans %}Use of abusive or hateful language will not be permitted; community members are advised to be polite in expressing their views.{% endtrans %}</li>
                    <li>{% trans %}Comments should not be used for promotion of an individual or any company.{% endtrans %}</li>
                    <li>{% trans %}Avoid posting your contact information like mobile number and email or any other personal information.{% endtrans %}</li>
                    <li>{% trans %}Avoid posting repeated questions. Try to use the search to see if the Question that you intend to ask has already been posted.{% endtrans %}</li>
                    <li>{% trans %}Any content that violates copyright, National and State Laws should not be posted. If you are quoting someone else's material or article give credit to the original author.{% endtrans %}</li>
                </ul>

                <p>
                    {% trans %}We have the right to alter, edit, remove, suspend or refuse any content without notice, if we consider that the content is objectionable or violates these terms or for any other reason.{% endtrans %}
                </p>
            </div>
        </div>
        <div class="modal-footer">

        </div>
    </div>
</div>
{% endblock %}

{% block javascripts %}
{{parent()}}
<script>
  $(document).ready(function(){
      $('#seeAllComments').click(function(){
          //show loader
              $('#shwoAllCommentsLoader').show();
              $.ajax({
                url: "{{ path('get_all_post_comments',{'id' : post.id}) }}",
                success: function(msg){
                        $('.answersAndCommentsCaontainer').html(msg);
                },
                complete: function(){
                }
              });
      });
      //add comment
      $('#postCommentButton').click(function(){
          var comment = $('#postCommentText').val();
          if(($.trim(comment)).length > 2){
              //show loader
              $('#commentLoader').show();
              $('#postCommentButton').hide();
              $.ajax({
                url: "{{ path('post_comment',{'id' : post.id}) }}/"+$.trim(comment),
                success: function(msg){
                    if(msg == 'login'){
                    }else if(msg != 'failed'){
                        $('.answersAndCommentsCaontainer').append(msg);
                    }
                },
                complete: function(){
                    $('#commentLoader').hide();
                    $('#postCommentButton').show();
                    $('#postCommentText').val("");
                }
              });
          }
      });
      
      {% if is_granted('ROLE_USER') and app.session.get('postComment')%}
        $('html, body').animate({
            scrollTop: $("#postCommentText").offset().top - 300
        }, 2000);
        
          //show loader
          $('#commentLoader').show();
          $('#postCommentButton').hide();
          $.ajax({
            url: "{{ path('post_comment',{'id' : post.id}) }}/"+$.trim("{{ app.session.get('postComment') }}"),
            success: function(msg){
                if(msg == 'login'){
                }else if(msg != 'failed'){
                    $('.answersAndCommentsCaontainer').append(msg);
                }
            },
            complete: function(){
                $('#commentLoader').hide();
                $('#postCommentButton').show();
                $('#postCommentText').val("");
            }
          });
      {% endif %}
  });
</script>
{% endblock %}